Ext.ns('Helper.HTML5');

/**
 * @author yanglg
 * @class Helper.HTML5.CanvasRenderingContext2D 来自于HTML5标准的Canvas.getContext()
 */
Ext.extend(Helper.HTML5.CanvasRenderingContext2D, Ext.emptyFn,
{
	/**
	 * @cfg {String} 填充样式
	 */
	fillStyle: null,
	/**
	 * @cfg {String} 修改字体和字号,'italic 30px serif'
	 */
	font: null,
	/**
	 * @cfg {Number} [globalAlpha=1] 全局阿尔法值
	 */
	globalAlpha: null,
	/**
	 * @cfg {Helper.HTML5.GlobalCompositeOperation} [globalCompositeOperation=source-over] 合成配置
	 */
	globalCompositeOperation: null,
	/**
	 * @cfg {Number} 线宽
	 */
	lineWidth: null,
	/**
	 * @cfg {Number} [shadowBlur=0] 阴影模糊
	 */
	shadowBlur: null,
	/**
	 * @cfg {Number} [shadowOffsetX=0] X轴阴影偏移
	 */
	shadowOffsetX: null,
	/**
	 * @cfg {Number} [shadowOffsetY=0] Y轴阴影偏移
	 */
	shadowOffsetY: null,
	/**
	 * @cfg {String} [shadowColor=#000000] 阴影颜色
	 */
	shadowColor: null,
	/**
	 * @cfg {String} 描边样式
	 */
	strokeStyle: null,
	/**
	 * @method 创建一个圆弧
	 * @param {Number} x 圆弧原点的x坐标值
	 * @param {Number} y 圆弧原点的y坐标值
	 * @param {Number} radius 半径
	 * @param {Number} startAngle 开始角度（以弧度为单位，360度是2π弧度）
	 * @param {Number} endAngle 结束角度（以弧度为单位，360度是2π弧度）
	 * @param {Boolean} anticlockwise 若为true，则圆弧按照逆时针方向绘制，false则为顺时针，若不传入此参数，firefox将报错 <h3>PS:</h3> <p>在Canvas中，一条弧线是由一条曲线定义的，它从原点(x,y)距离为一个半径且角度为开始角度的位置开始，这条路径最后停在离远点(x,y)
	 *        一个半径且角度为结束角度的位置上</p> <p><img src="resources/images/arc.png"/></p>
	 * 
	 * <pre><code>
	 * context.arc(230, 90, 50, 0, Math.PI, false); //绘制一个半圆
	 * context.arc(230, 90, 50, 0, Math.PI * 3, false); //绘制一个圆
	 * </code></pre>
	 */
	arc: function( x, y, radius, startAngle, endAngle, anticlockwise )
	{
	},
	/**
	 * @method 开始路径
	 */
	beginPath: function()
	{
	},
	/**
	 * @method 绘制三次贝塞尔曲线
	 * @param {Number} cp1x 第一个控制点的X值
	 * @param {Number} cp1y 第一个控制点的Y值
	 * @param {Number} cp2x 第二个控制点的X值
	 * @param {Number} cp2y 第二个控制点的Y值
	 * @param {Number} x 路径目标点的X坐标
	 * @param {Number} y 路径目标点的y坐标 <p><img src="resources/images/bezierCurve.png" alt="arc"/></p>
	 */
	bezierCurveTo: function( cp1x, cp1y, cp2x, cp2y, x, y )
	{
	},
	/**
	 * 擦除画布
	 * 
	 * @param {Number} x 原点横坐标
	 * @param {Number} y 原点纵坐标
	 * @param {Number} width 宽度
	 * @param {Number} height 高度
	 */
	clearRect: function( x, y, width, height )
	{
	},
	/**
	 * @method 结束路径
	 */
	closePath: function()
	{
	},
	/**
	 * @method 创建线性渐变
	 * @param {Number} startX 渐变起点的X坐标
	 * @param {Number} startY 渐变起点的Y坐标
	 * @param {Number} endX 渐变终点的X坐标
	 * @param {Number} endY 渐变终点的Y坐标
	 * @return {Helper.HTML5.CanvasGradient} 返回一个渐变对象
	 */
	createLinearGradient: function( startX, startY, endX, endY )
	{
	},
	/**
	 * @method 创建放射渐变
	 * @param {Number} x0 第一个圆心X坐标
	 * @param {Number} y0 第一个圆心Y坐标
	 * @param {Number} r0 第一个圆半径
	 * @param {Number} x1 第二个圆心X坐标
	 * @param {Number} y1 第二个圆心Y坐标
	 * @param {Number} r1 第二个圆半径
	 * @return {Helper.HTML5.CanvasGradient} 返回一个渐变对象
	 */
	createRadialGradient: function( x0, y0, r0, x1, y1, r1 )
	{
	},
	/**
	 * @method 从零绘制图像
	 * @param {Number} width 宽度
	 * @param {Number} height 高度
	 * @return {Helper.HTML5.ImageData} 图像数据
	 */
	createImageData: function(width,height)
	{
	},
	/**
	 * @method 把整个图像或者视频复制到画布，将其放置到指定点的左上角，并且将每个图像或者视频像素映射成画布坐标系统的一个单元
	 * @param {Object} imageOrVideo 要绘制的图像或者视频
	 * @param {Number} x 左上角x坐标
	 * @param {Number} y 左上角y坐标
	 */
	drawImage: function( imageOrVideo, x, y )
	{

	},
	/**
	 * @method (PS:drawImage的重载方法，方法名应为drawImage) 把整个图像或者视频复制到画布，但是允许您用画布单位来指定想要的图像或者视频的宽度和高度
	 * @param {Object} imageOrVideo 要绘制的图像或者视频
	 * @param {Number} x 左上角x坐标
	 * @param {Number} y 左上角y坐标
	 * @param {Number} width 宽度
	 * @param {Number} height 高度
	 */
	drawImage_2: function( imageOrVideo, x, y, width, height )
	{
		
	},
	/**
	 * @method (PS:drawImage的重载方法，方法名应为drawImage) 完全通用的，它允许您指定图像或者视频的任何矩形区域并复制它，对画布中的任何位置都可进行任何的缩放
	 * @param {Object} imageOrVideo  要绘制的图像或者视频
	 * @param {Number} sourceX 图像左上角x坐标
	 * @param {Number} sourceY 图像左上角y坐标
	 * @param {Number} sourceWidth 图像宽度
	 * @param {Number} sourceHeight 图像高度
	 * @param {Number} destX 画布左上角x坐标
	 * @param {Number} destY 画布左上角y坐标
	 * @param {Number} destWidth 画布宽度
	 * @param {Number} destHeight 画布高度
	 */
	drawImage_3: function( imageOrVideo, sourceX, sourceY, sourceWidth, sourceHeight, destX, destY, destWidth, destHeight )
	{

	},
	/**
	 * @method 绘制填充文字
	 * @param {String} text 文字内容
	 * @param {Number} x 文本原点（左下角）横坐标值
	 * @param {Number} y 文本原点（左下角）纵坐标值
	 */
	fillText: function( text, x, y )
	{

	},
	/**
	 * @method 绘制一个填充矩形
	 * @param {Number} x 距原点的x轴距离
	 * @param {Number} y 距原点的y轴距离
	 * @param {Number} width 矩形的宽度
	 * @param {Number} height 矩形的高度
	 */
	fillRect: function( x, y, width, height )
	{
	},
	/**
	 * @method 访问像素
	 * @param {Number} x 要访问像素区域原点横坐标
	 * @param {Number} y 要访问像素区域原点纵坐标
	 * @param {Number} width 像素区域的宽度
	 * @param {Number} height 像素区域的高度
	 * @return {Helper.HTML5.ImageData} 像素数据
	 */
	getImageData: function( x, y, width, height )
	{
	},
	/**
	 * @method 设置路径终点
	 * @param {Number} x x
	 * @param {Number} y y
	 */
	lineTo: function( x, y )
	{

	},
	/**
	 * @method 设置路径原点
	 * @param {Number} x x
	 * @param {Number} y y
	 */
	moveTo: function( x, y )
	{
	},
	/**
	 * @method 在画布上输出文本之前，检查字体的宽度
	 * @param {String} text 要测量的文本
	 * @return {Object} 返回包含一个对象，该对象包含以像素计的指定字体宽度 context.measureText(text).width
	 */
	measureText: function( text )
	{

	},
	/**
	 * 将像素数据绘制到画布上
	 * @param {Helper.HTML5.ImageData} imageData 像素数据
	 * @param {Number} x 绘制像素数据的原点横坐标
	 * @param {Number} y 绘制像素数据的原点纵坐标
	 */
	putImageData: function( imageData, x, y )
	{
	},
	/**
	 * @method 绘制二次贝塞尔曲线
	 * @param {Number} cpx 控制点的X值
	 * @param {Number} cpy 控制点的Y值
	 * @param {Number} x 路径目标点的X坐标
	 * @param {Number} y 路径目标点的y坐标 <p><img src="resources/images/quadraticCurve.png" alt="arc"/></p>
	 */
	quadraticCurveTo: function( cpx, cpy, x, y )
	{
	},
	/**
	 * @method 绘制一个矩形路径
	 * @param {Number} x x坐标
	 * @param {Number} y y坐标
	 * @param {Number} width 宽度
	 * @param {Number} height 高度
	 */
	rect: function( x, y, width, height )
	{
	},
	/**
	 * @method 恢复画布状态，将canvas状态堆栈顶部的条目弹出
	 */
	restore: function()
	{
	},
	/**
	 * @method 旋转
	 * @param {Number} angle 旋转角度
	 */
	rotate: function( angle )
	{
	},
	/**
	 * @method 保存画布状态，将当前的canvas的状态推送到一个保存canvas状态的堆栈的顶部
	 */
	save: function()
	{
	},
	/**
	 * @method 缩放
	 * @param {Number} x 横坐标缩放倍数
	 * @param {Number} y 纵坐标缩放倍数
	 */
	scale: function( x, y )
	{
	},
	/**
	 * @method 重置变换矩阵 setTransform(1,0,0,1,0,0)
	 * @param {Number} xScale x轴缩放
	 * @param {Number} ySkew y轴倾斜角度
	 * @param {Number} xSkew x轴倾斜角度
	 * @param {Number} yScale y轴缩放
	 * @param {Number} xTrans 平移画布原点 x轴
	 * @param {Number} yTrans 平移画布原点 y轴
	 */
	setTransform: function( xScale, ySkew, xSkew, yScale, xTrans, yTrans )
	{
	},
	/**
	 * @method 绘制描边
	 */
	stroke: function()
	{
	},
	/**
	 * @method 绘制一个描边矩形
	 * @param {Number} x 距原点的x轴距离
	 * @param {Number} y 距原点的y轴距离
	 * @param {Number} width 矩形的宽度
	 * @param {Number} height 矩形的高度
	 */
	strokeRect: function( x, y, width, height )
	{
	},
	/**
	 * @method 绘制描边文字
	 * @param {String} text 文字内容
	 * @param {Number} x 文本原点（左下角）横坐标值
	 * @param {Number} y 文本原点（左下角）纵坐标值
	 */
	strokeText: function( text, x, y )
	{
	},
	/**
	 * @method 平移坐标原点
	 * @param {Number} x 横坐标
	 * @param {Number} y 纵坐标
	 */
	translate: function( x, y )
	{
	},
	/**
	 * @method 变换矩阵
	 * @param {Number} xScale x轴缩放
	 * @param {Number} ySkew y轴倾斜角度
	 * @param {Number} xSkew x轴倾斜角度
	 * @param {Number} yScale y轴缩放
	 * @param {Number} xTrans 平移画布原点 x轴
	 * @param {Number} yTrans 平移画布原点 y轴
	 */
	transform: function( xScale, ySkew, xSkew, yScale, xTrans, yTrans )
	{
	}

});